<style lang="less">
    @import "./home.less";
    @import "../../styles/common.less";
</style>
<template>
    <div class="home-main">
            <Row>
                <Col span="24" class-name="">
                <Row>
                    <Col span="6">
                        <infor-card id-name="user_created_count" :end-val="count.createUser" iconType="ios-videocam" color="#2d8cf0" intro-text="现在直播人数"></infor-card>
                    </Col>
                    <Col span="6" class-name="padding-left-5">
                    <infor-card
                            id-name="visit_count"
                            :end-val="count.money"
                            iconType="social-yen"
                            color="#64d572"
                            :iconSize="50"
                            intro-text="今日收入"
                    ></infor-card>
                    </Col>
                    <Col span="6" class-name="padding-left-5">
                    <infor-card
                            id-name="collection_count"
                            :end-val="count.liveNum"
                            iconType="videocamera"
                            color="#ffd572"
                            intro-text="今日直播场次"
                    ></infor-card>
                    </Col>
                    <Col span="6" class-name="padding-left-5">
                    <infor-card
                            id-name="transfer_count"
                            :end-val="count.watchNum"
                            iconType="android-person-add"
                            color="#f25e43"
                            intro-text="观看人数"
                    ></infor-card>
                    </Col>
                </Row>
                </Col>
            </Row>
            <Row class="margin-top-10">
                <Col span="12">
                <Card>
                    <p slot="title" class="card-title">
                        <Icon type="android-person-add"></Icon>
                        本周新增会员
                  </p>
                    <div class="data-source-row">
                        <this-week-news-user></this-week-news-user>
                    </div>
                </Card>
                </Col>
                <Col span="12" class="padding-left-10">
                <Card>
                    <p slot="title" class="card-title">
                        <Icon type="android-microphone"></Icon>
                        本周认证主播
                   </p>
                    <div class="data-source-row">
                        <this-week-news-live></this-week-news-live>
                    </div>
                </Card>
                </Col>

            </Row>
            <Row class="margin-top-10">
                <Card>
                    <p slot="title" class="card-title">
                        <Icon type="ios-shuffle-strong"></Icon>
                        热门礼物排行(前十)
                   </p>
                    <div class="gift-chart-con">
                        <hot-gift-chart></hot-gift-chart>
                    </div>
                </Card>
            </Row>
    </div>
</template>

<script>
import cityData from './map-data/get-city-value.js';
import homeMap from './components/map.vue';
import thisWeekNewsLive from './components/thisWeekNewsLive.vue';
import thisWeekNewsUser from './components/thisWeekNewsUser.vue';
import hotGiftChart from './components/hotGiftChart.vue';
import userFlow from './components/userFlow.vue';
import countUp from './components/countUp.vue';
import inforCard from './components/inforCard.vue';
import mapDataTable from './components/mapDataTable.vue';
import toDoListItem from './components/toDoListItem.vue';
import Row from "../../../node_modules/iview/src/components/grid/row";

export default {
    name: 'home',
    components: {
        Row, homeMap,
        thisWeekNewsUser,
        thisWeekNewsLive,
        hotGiftChart,
        userFlow,
        countUp,
        inforCard,
        mapDataTable,
        toDoListItem
    },
    data () {
        return {
            countURl:'/live/counthead',
            count: {
                //现在直播人数
                createUser: 0,
                //今日收入
                money: 0,
                //今日直播场次
                liveNum: 0,
                //观看人数
                watchNum: 0,
            },

        };
    },
    created () {
        this.getData();
    },
    methods: {
        getData(){
            let self=this;
            self.$axios.get(self.countURl).then((res) => {
                if(res.data.code == 200){
                    self.count.createUser = res.data.data.nowLive;
                    self.count.money = res.data.data.todayIn;
                    self.count.liveNum = res.data.data.todayLive;
                    self.count.watchNum = res.data.data.todayWatch;
                }
            })
        }
    }
};
</script>
